<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Chart.js Test</title>
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</head>
<body>
    <h2>情感分析</h2>
    <canvas id="halfCircleChart1" width="400" height="200"></canvas>
    <script>
        window.onload = function() {
            const ctx = document.getElementById('halfCircleChart1').getContext('2d');

            const data = {
                labels: ['负面', '正面'],
                datasets: [{
                    data: [30, 70], // 使用静态数据
                    backgroundColor: ['rgba(255, 99, 132, 0.2)', 'rgba(75, 192, 192, 0.2)'],
                    borderColor: ['rgba(255, 99, 132, 1)', 'rgba(75, 192, 192, 1)'],
                    borderWidth: 1
                }]
            };

            const options = {
                rotation: Math.PI,
                circumference: Math.PI,
                cutout: '70%',
                plugins: {
                    legend: {
                        display: false
                    },
                    tooltip: {
                        enabled: false
                    }
                }
            };

            new Chart(ctx, {
                type: 'doughnut',
                data: data,
                options: options
            });
        };
    </script>
</body>
</html>
